{layout name="layout" /}

<div class="order-detail">
    <h2>订单详情</h2>
    
    <div class="order-info">
        <div class="info-row">
            <span class="info-label">订单号：</span>
            <span class="info-value">{$order.orderId}</span>
        </div>
        <div class="info-row">
            <span class="info-label">用户名：</span>
            <span class="info-value">{$order.uName}</span>
        </div>
        <div class="info-row">
            <span class="info-label">下单时间：</span>
            <span class="info-value">{$order.orderDate}</span>
        </div>
        <div class="info-row">
            <span class="info-label">订单状态：</span>
            <span class="info-value status-{$order.status}">{$order.status}</span>
        </div>
        <div class="info-row">
            <span class="info-label">总金额：</span>
            <span class="info-value price">¥{$sumPrice}</span>
        </div>
    </div>
    
    <h3>订单商品</h3>
    <table class="order-items">
        <thead>
            <tr>
                <th>商品图片</th>
                <th>商品ID</th>
                <th>商品名称</th>
                <th>单价</th>
                <th>数量</th>
                <th>小计</th>
            </tr>
        </thead>
        <tbody>
            {foreach name="items" item="item"}
            <tr>
                <td><img src="../../../static/upload/{$item.pImg}" class="product-thumbnail"></td>
                <td>{$item.pId}</td>
                <td>{$item.pName}</td>
                <td>¥{$item.pPrice}</td>
                <td>{$item.number}</td>
                <td>¥{$item.totalPrice}</td>
            </tr>
            {/foreach}
        </tbody>
    </table>
    
    <div class="action-buttons">
        <a href="javascript:history.go(-1);" class="btn-back">返回</a>
    </div>
</div>